<template>
  <div>
    <FilterTable
      ref="table"
      :columns="columns"
      columnsRef="partPartInfoManagePartInfoModelSelect"
      :dataSource="dataSorce"
      :datakey="'rows'"
      selectionType="single"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="handleTableRowSelect"
    >
    </FilterTable>
    <div class="bottomBtn">
      <el-button @click="closeDialog">取 消</el-button>
      <el-button type="primary" @click="handleConfirm">确定</el-button>
    </div>
  </div>
</template>

<script>
import { getModelData } from '@/api/common/cars/brandcarsModels';

export default {
  props: ['seriesId'],
  data() {
    return {
      // fetchapi: getModelData,
      // fetchParams: {xhrAbort:true},
      columns: this.createTableColumns(),
      dataSorce: [],
      selectedRow: []
    };
  },
  mounted() {
    if (this.seriesId) {
      this.queryTableData();
    }
  },
  methods: {
    createTableColumns() {
      return [
        {
          title: '车型代码',
          dataIndex: 'modelCode'
        },
        {
          title: '车型名称',
          dataIndex: 'modelName'
        }
      ];
    },
    async queryTableData() {
      this.$refs.table.START_LOADING();
      let res = await getModelData(this.seriesId);
      this.$refs.table.STOP_LOADING();
      if (res.resultCode == 200) {
        this.dataSorce = res.data;
      }
    },
    handleTableRowSelect(e) {
      this.selectedRow = e;
    },
    closeDialog() {
      this.$emit('close');
    },
    handleConfirm() {
      if (this.selectedRow.length) {
        this.$emit('onConfirm', this.selectedRow[0]);
        this.closeDialog();
      } else {
        this.$notify.warning('请选择一条数据！');
      }
    }
  }
};
</script>

<style scoped>
.bottomBtn {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9;
  border-top: 1px solid #e9e9e9;
  padding: 10px 20px;
  background: #fff;
  text-align: right;
}
</style>
